<template>
  <div>
    <Field v-model="iccid" label="ICCID号" placeholder="请输入SIM卡上的ICCID号"/>
    <div style="margin:40px 0;padding: 0 20px">
      <van-button type="info" :disabled="!Boolean(iccid)" style="width: 100%" @click="handleClick">确认添加
      </van-button>
      <div class="tips">1、每个人最多可绑定10张卡</div>
      <div class="tips">2、SIM卡必须完成实名认证和首充激活才能使用</div>
    </div>
    <van-dialog v-model="showDialog" title="提示" message="添加成功" @confirm="()=>{
      $router.push('/sim')
    }"/>
  </div>
</template>

<script>
  import {Field,Dialog,Toast} from 'vant'
  import {bindCard} from "../../api/user";

  export default {
    name: "addSim",
    components: {Field, [Dialog.Component.name]: Dialog.Component,Toast},
    data() {
      return {
        iccid: '',
        showDialog: false
      }
    },
    mounted() {
      console.log(this.$store.state.app.userInfo)
    },

    methods:{
      async handleClick(){
        if(!this.iccid){
          // Toast.fail('添加失败');
          Dialog.alert({
            title: '系统提示',
            message: '请输入ICCID',
          })
        }else{
          try {
            await bindCard({
              iccid:this.iccid,
              agentId:localStorage.getItem('agentId')
            })
            this.showDialog = true
          }
          catch (e) {
            Toast(e.errParams[0]);
          }

        }
        // $router.push('sim')
      }
    }
  }
</script>

<style scoped>
  .tips {
    margin-top: 5px;
    /*text-align: center;*/
    color: #969799;
  }
</style>
